import 'package:flutter/material.dart';

class ProgressAnimationRoute extends StatefulWidget {
  const ProgressAnimationRoute({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _ProgressAnimationRouteState();
}

class _ProgressAnimationRouteState extends State<ProgressAnimationRoute>
    with SingleTickerProviderStateMixin {
  late AnimationController _controller;

  @override
  void initState() {
    _controller =
        AnimationController(duration: const Duration(seconds: 5), vsync: this);
    _controller.forward();
    _controller.addListener(() {
      setState(() {});
    });
    super.initState();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('进度色动画'),
      ),
      body: SingleChildScrollView(
        child: Center(
          child: Padding(
            padding: const EdgeInsets.all(20),
            child: Stack(
              children: <Widget>[
                SizedBox(
                  child: LinearProgressIndicator(
                    backgroundColor: Colors.grey[200],
                    valueColor: ColorTween(begin: Colors.grey, end: Colors.blue)
                        .animate(_controller),
                    value: _controller.value,
                  ),
                  height: 26,
                ),
                Align(
                  alignment: Alignment.center,
                  child: Text(
                    "${(_controller.value * 100).toStringAsFixed(0)} %",
                    style: const TextStyle(fontSize: 18),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
